<template>
    <div id="app">
        <div class="wrapBox" v-if="showpage">
            <router-view v-if="!$route.meta.keepAlive"/>
            <keep-alive>
              <router-view v-if="$route.meta.keepAlive"></router-view>
            </keep-alive>
        </div>
        <!-- <div v-if="classValue">
        <picker :data="roleList" v-model="roleId" :columns=2></picker>
        <x-button @click.native="submitRole">确定</x-button>
        </div> -->

    </div>
</template>

<script>
import { IsLocalHost } from '@/utils/const'
import { TransferDom, Popup, Picker, XButton } from "vux";
export default {
  directives: {
    TransferDom
  },
  name: "App",
  data() {
    return {
      showpage: false,
      roleList: [],
      roleId: [],
      classValue: false
    };
  },
  components: { Popup, Picker, XButton },
  created() {
    if (IsLocalHost) {
      this.login();
    }
    let that = this;
    this.$bridge.registerHandler("setToken", function(data) {
                     that.$store.state.Authorization =
      "Bearer " + data;
      that.getUserInfo();
    })
    this.connectWebViewJavascriptBridge(function(bridge) {
        bridge.registerHandler("setToken", function(data) {
                         that.$store.state.Authorization =
      "Bearer " + data;
      that.getUserInfo();
      });
    });
  },
  mounted () {
    let that = this;
    this.$bridge.registerHandler("setToken", function(data) {
                     that.$store.state.Authorization =
      "Bearer " + data;
      that.getUserInfo();
    })
    this.connectWebViewJavascriptBridge(function(bridge) {
        bridge.registerHandler("setToken", function(data) {
                         that.$store.state.Authorization =
      "Bearer " + data;
      that.getUserInfo();
      });
    });
    this.getUserInfo();
  },
  methods: {
    connectWebViewJavascriptBridge(callback) {
      if (window.WebViewJavascriptBridge) {
        callback(WebViewJavascriptBridge);
      } else {
        document.addEventListener(
        "WebViewJavascriptBridgeReady",
        function() {
          callback(WebViewJavascriptBridge);
        },
        false
        );
      }
    },
    login() {
      let params = {
        username: "fyyz",
        password: "123456"
      };
      let that = this;
      this.$axiosAjax.login(params).then(res => {
        window.localStorage.setItem('token',"Bearer " + res.data.result.accessToken)

        this.$store.state.Authorization =
          "Bearer " + res.data.result.accessToken;
          this.$axiosAjax.getUserInfo().then(res => {
            if(res.data.success){
              localStorage.userid=res.data.result.id
              localStorage.useraccount=res.data.result.userAccount
              localStorage.userName=res.data.result.userName
              localStorage.setItem('userInfo', JSON.stringify(res.data.result))
              that.$store.state.depart.departNanme=res.data.result.departNanme
              that.$store.state.depart.departId=res.data.result.departId
            }
            that.$store.state.departType = res.data.result.departType;
            that.$store.state.departId = res.data.result.departId;
            that.$store.state.departNanme = res.data.result.departNanme;
            that.$store.state.userid = res.data.result.id;
            that.$store.state.useraccount = res.data.result.userAccount;
            that.$store.state.userName = res.data.result.userName;
            that.showpage = true;
            that.classValue = false;
          });
        that.$axiosAjax.getCurrentUserRoleList().then(res => {
          that.$nextTick(function() {
            res.data.result.forEach(item => {
              that.roleList.push({
                name: item.roleName,
                value: item.id
              });
            });
            if (that.roleList.length == 1) {
              that.roleId = [that.roleList[0].value];
              that.submitRole();
            } else {
              this.roleId = [];
              // that.classValue = true;
            }
            that.$forceUpdate();
          });
        });
      });
    },
    submitRole() {
      let that = this;
      if (this.roleId.length == 0) {
        this.$vux.text("请先选择用户角色");
        return;
      }
      that.$axiosAjax
        .setCurrentUserRole({ roleId: this.roleId[0] })
        .then(response => {
          that.$axiosAjax.getUserInfo().then(res => {
            if(res.data.success){
              localStorage.userid=res.data.result.id
              localStorage.useraccount=res.data.result.userAccount
              localStorage.setItem('userInfo', JSON.stringify(res.data.result))
            }
            that.$store.state.departType = res.data.result.departType;
            that.$store.state.departId = res.data.result.departId;
            that.$store.state.departNanme = res.data.result.departNanme;
            that.$store.state.userid = res.data.result.id;
            that.$store.state.useraccount = res.data.result.userAccount;
            that.$store.state.userName = res.data.result.userName;
            that.showpage = true;
            that.classValue = false;
          });
        })
        .catch(() => {});
    },
    getUserInfo() {
      this.$axiosAjax.getUserInfo().then(res => {
          if(res.data.success){
            localStorage.userid=res.data.result.id
            localStorage.useraccount=res.data.result.userAccount
            localStorage.setItem('userInfo', JSON.stringify(res.data.result))
          }
          this.$store.state.departType = res.data.result.departType;
          this.$store.state.departId = res.data.result.departId;
          this.$store.state.departNanme = res.data.result.departNanme;
          this.$store.state.userid = res.data.result.id;
          this.$store.state.useraccount = res.data.result.userAccount;
          this.showpage = true;
          this.classValue = false;
        });
    }
  }
};
</script>
<style lang="less">
  img {
    content: normal !important;
  }
  #tt {
    background-color: #eee;
    .weui-textarea{
      height: 180px!important;
      background-color: #fff;
    }
  }
  #sle3 .weui-cells_radio label .weui-cell__bd p .vux-radio-label{
    display: block;
    height: 60px;
    line-height: 20px;
    // padding: 10px 15px!important;
    --webkit-line-clamo:2;
    --webkit-box-orient:vertical;
    overflow: hidden;/*超出部分隐藏*/
    text-overflow:ellipsis;/*文字超出部分以省略号显示*/
  }
  #sle3 .weui-cell__bd{
    height: 60px;
    line-height: 20px;
    width: 300px;
    background-color: pink;
  }
    #sle3 .weui-cell__bd p{
    height: 60px;
    line-height: 20px;
    width: 300px;
    background-color: skyblue;
  }
    #sle5 .weui-cells_radio label .weui-cell__bd p .vux-radio-label{
    display: block;
    height: 20px;
    line-height: 20px;
    // padding: 10px 15px!important;
    --webkit-line-clamo:1;
    --webkit-box-orient:vertical;
    overflow: hidden;/*超出部分隐藏*/
    text-overflow:ellipsis;/*文字超出部分以省略号显示*/
  }
  #sle4 label .weui-cell__bd p{
    color: #000!important;
  }
.headerBox{
    width: 100%;
    height: 40px;
    position: fixed;
    top: 0;
    z-index: 9999;
    .header {
      width: 100%;
      height: 40px;
      line-height: 40px;
      text-align: center;
      position: relative;
      font-size: 16px;
      background: #469b7a;
      color: #fff;
      .vux-x-icon {
        fill: cornsilk;
        position: absolute;
        left: 4px;
        top: 9px;
        width: 26px;
        height: 20px;
      }
  }
}

</style>
<style>
#app {
  height: 100%;
  width: 100%;
  font-family: "Avenir", Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.wrapBox {
  height: 100%;
}
.weui-cells{
    margin-top: 0!important;
  }
 .weui-cells:after, .weui-cells:before{
    border:0!important;
  }
  #aa {
    padding-right: 24px;
    padding-left: 0;
  }
    #aa .vux-cell-bd .vux-label{
    color: #469b7a;
    font-weight: bold;
    font-size: 16px;
  }

  .vux-cell-placeholder{
    font-size: 14px;
  }
  .vux-cell-placeholder, .vux-cell-value{
    padding-right: 8px!important;
  }
  .form-item .weui-cell_access .weui-cell__ft::after{
    height: 8px!important;
    width: 8px!important;
    margin-top: 0px;
  }
.clearfix:after {
  display: block;
  clear: both;
  content: "";
  visibility: hidden;
  height: 0;
}
.clearfix {
  zoom: 1;
}
em {
  font-style: normal;
}
body {
  height: 100%;
  width: 100%;
  overflow: auto; /* winphone8和android4+ */
  -webkit-overflow-scrolling: touch; /* ios5+ */
}
.workmain .weui-grids:after,
.workmain .weui-grids:before {
  border-top: 0;
}
body .vux-header {
  background-color: #469b7a;
}
body .vux-header .vux-header-title > span {
  color: #fff;
  font-size: 16px;
}
body .weui-search-bar__cancel-btn {
  color: #469b7a;
}
.select .vux-x-icon {
  fill: #469b7a;
}
body .weui-tabbar {
  position: fixed;
  z-index: 0;
}

.notice .weui-cell_access .weui-cell__ft {
  width: 26px;
}
.test .weui-cell_access .weui-cell__ft {
  width: 26px;
}
.looktest .weui-cell_access .weui-cell__ft {
  width: 100px;
}
.looktest .weui-cell__hd,
.looktest .vux-cell-bd {
  display: none;
}
body .vux-header .vux-header-left a {
  color: #fff;
}
body .vux-header .vux-header-left .left-arrow:before {
  border-color: #fff;
}
@keyframes showaa {
  0% {
    transform: rotate(0);
  }
  50% {
    transform: rotate(20deg);
  }
  100% {
    transform: rotate(36deg);
  }
}
.weui-icon_toast.weui-loading {
  animation: showaa 1s infinite;
}

</style>
